import { defineComponent } from "vue";
import ErrorBoundary from "@/components/ErrorBoundary";

export default defineComponent({
  setup() {
    return () => (
      <ErrorBoundary fallback={({ error }) => <ErrorRenderer error={error} />}>
        <ThrowError throwError />
      </ErrorBoundary>
    );
  },
});

function ThrowError({ throwError }: { throwError: boolean }) {
  if (throwError) {
    throw new Error("Aha!");
  }
  return <div>{throwError}</div>;
}

function ErrorRenderer({ error }: { error: unknown }) {
  if (error instanceof Error) {
    return <div>💥{error.message}</div>;
  }
  return <div>💥 unknown error!</div>;
}
